import React,{Component} from 'react';
import {Header,Image,Segment,Form} from "semantic-ui-react";

class AccountTab extends Component{
     /*constructor(props){
         super(props)
         this.state={
             allInfo:props.allInfo
         }
         console.log(props.allInfo.address,'props状态')
     }*/

    render() {
        let {address,balance,txCount} = this.props.allInfo
        return(

            <div>
                <Header as="h2" color="teal" textAlign="center">
                    <Image src="images/logo.png" /> ETH钱包
                </Header>
                <Segment stacked textAlign="left">
                    <Header as="h1">Account</Header>
                    <Form.Input
                        style={{ width: "100%" }}
                        action={{
                            color: "teal",
                            labelPosition: "left",
                            icon: "address card",
                            content: "地址"
                        }}
                        actionPosition="left"
                        value={address}
                    />
                    <br />
                    <Form.Input
                        style={{ width: "100%" }}
                        action={{
                            color: "teal",
                            labelPosition: "left",
                            icon: "ethereum",
                            content: "余额"
                        }}
                        actionPosition="left"
                        value={balance}
                    />
                    <br />
                    <Form.Input
                        actionPosition="left"
                        action={{
                            color: "teal",
                            labelPosition: "left",
                            icon: "numbered list",
                            content: "交易"
                        }}
                        style={{ width: "100%" }}
                        value={txCount}
                    />
                </Segment>
            </div>
        )
    }
}





// let AccountTab = (props)=>{
//
//
//    let{address,balance,txCount} = props.allInfo
//     console.log(address,balance,txCount,122)
//         return(
//             <div>
//                 <Header as="h2" color="teal" textAlign="center">
//                     <Image src="images/logo.png" /> ETH钱包
//                 </Header>
//                 <Segment stacked textAlign="left">
//                     <Header as="h1">Account</Header>
//                     <Form.Input
//                         style={{ width: "100%" }}
//                         action={{
//                             color: "teal",
//                             labelPosition: "left",
//                             icon: "address card",
//                             content: "地址"
//                         }}
//                         actionPosition="left"
//                         value={address}
//                     />
//                     <br />
//                     <Form.Input
//                         style={{ width: "100%" }}
//                         action={{
//                             color: "teal",
//                             labelPosition: "left",
//                             icon: "ethereum",
//                             content: "余额"
//                         }}
//                         actionPosition="left"
//                         value={balance}
//                     />
//                     <br />
//                     <Form.Input
//                         actionPosition="left"
//                         action={{
//                             color: "teal",
//                             labelPosition: "left",
//                             icon: "numbered list",
//                             content: "交易"
//                         }}
//                         style={{ width: "100%" }}
//                         value={txCount}
//                     />
//                 </Segment>
//             </div>
//         )
//
//
//
// }

export default AccountTab;
